import {Button, message} from 'antd';
import React, {useRef, useState} from 'react';
import {PageContainer} from '@ant-design/pro-layout';
import {isSuccess, isSuccessful} from "@/utils/utils";
import {UserManager} from "@/services/api-functions";
import ProTable, {ActionType, ProColumns} from "@ant-design/pro-table";
import {PlusOutlined} from "@ant-design/icons";
import {SYS_ENUMS, TableListItem} from "@/utils/constants";
import CreateForm from "@/components/CreateForm/CreateForm";

export const userStateChange = async (select: any, state: number) => {
  if (!select) return true;
  try {
    if (isSuccess((await UserManager.userEnablingMod({userId: select.id, enabling: state}))?.code)) {
      message.success(state ? '解除成功' : '冻结成功');
      return true;
    }
    return false
  } catch (error) {
    return false;
  }
};


const MemberList: React.FC<any> = ({}) => {
  const [visible, setVisible] = useState<any>(false);
  const [activeRecord, setActiveRecord] = useState<any>(undefined);
  const [active, setActive] = useState<any>(false);
  const [visiblePwd, setVisiblePwd] = useState<any>(false);
  const actionRef = useRef<ActionType>();
  const formRef = useRef<ActionType>();
  const columns: ProColumns[] = [
    {
      title: 'id',
      dataIndex: 'id',
      ellipsis: true,
      hideInTable:true,
      width: 120,
      renderFormItem: ((schema, config) => <span>{activeRecord&&activeRecord.id}</span>)
    },
    {
      title: '标签名',
      dataIndex: 'tagName',
      ellipsis: true,
      width: 120,
    },
    {
      title: '创建时间',
      dataIndex: 'createTime',
      hideInTable: false,
      hideInForm: true,
    },
    // {
    //   title: '操作',
    //   dataIndex: 'option',
    //   valueType: 'option',
    //   hideInSearch: true,
    //   hideInForm: true,
    //   fixed: 'right',
    //   render: (_, record) => [
    //     <a onClick={() => {
    //       setVisible(true);
    //       setActiveRecord(record)
    //     }}>修改</a>
    //   ],
    // },
  ];

  const create = () => <CreateForm onCancel={() => {
    setVisible(false)
    setActiveRecord(undefined)
  }} title='添加标签' modalVisible={visible}>
    <ProTable<TableListItem, TableListItem>
      onSubmit={async (value: any) => {
        const resp = await UserManager.editTag(value);
        if (isSuccessful(resp)) {
          setVisible(false);
          if (actionRef.current) {
            actionRef.current.reload();
          }
        }
      }}
      rowKey="key"
      actionRef={formRef}
      type="form"
      form={{initialValues: activeRecord}}
      columns={columns}
    />
  </CreateForm>;

  return (
    <PageContainer>
      <ProTable<any, any>
        actionRef={actionRef}
        rowKey="key"
        search={false}
        toolBarRender={() => [
          <Button type="primary" key="primary" onClick={() => setVisible(true)}>
            <PlusOutlined /> 添加标签
          </Button>,
        ]}
        request={async (params) => {
          const query = {...params}
          const {data: {records, total}, code}: any = await UserManager.queryTagList(query);
          return {data: records || [], success: isSuccess(code), total: isSuccess(code) ? total : 0};
        }}
        columns={columns}
        scroll={{ x: 1300 }}
      />
      {create()}
    </PageContainer>
  );
};

export default MemberList;
